{% extends "profiles/base_profile_edit.html" %}
{% load static %}
{% load i18n %}

{% block profile-admin-gold-edit %}active{% endblock %}

{% block title %}
Read the Docs Gold
{% endblock %}

{% block extra_scripts %}
  <script src="https://js.stripe.com/v3/" type="text/javascript"></script>
  <script type="text/javascript" src="{% static 'gold/js/checkout.js' %}"></script>
  <script type="text/javascript">
   var checkout_views = require('gold/checkout');
   $(document).ready(function () {
       var key;
       //<![CDATA[
       key = '{{ stripe_publishable }}';
       //]]>

       var view = checkout_views.StripeCheckoutView.init({
           stripeKey: key,
           formId: 'submit',
           levelId: 'id_level',
           checkoutSessionUrl: '{% url "gold_checkout_create" %}',
           csrfToken: document.querySelector("[name=csrfmiddlewaretoken]").value
       });
   });
  </script>
{% endblock %}

{% block edit_content %}
  <div>
    <h2>{% trans 'Read the Docs Gold Membership' %}</h2>

    <p>
      {% blocktrans trimmed %}
        Supporting Read the Docs lets us work more on features that people love.
        Your money will go directly to maintenance and development of the
        product.
      {% endblocktrans %}
    </p>

    <p>
    {% blocktrans trimmed %}
      Gold members may completely remove advertising for all visitors to their projects.
    {% endblocktrans %}
    </p>

    <ul class="donate-about">
      <li>{% trans 'For small businesses or personal projects, we ask for $5 per month to remove ads from a project.' %}</li>
      <li>{% trans 'For corporate supported open source projects, we ask for a $50 membership in order to cover our support and operations costs.' %}</li>
    </ul>

    <p>
    {% blocktrans trimmed %}
      If you are a company using Read the Docs,
      please consider <a href="https://readthedocs.com/">Read the Docs for Business</a>.
      This will help us cover our costs,
      and provide you with a better experience on the site.
    {% endblocktrans %}
    </p>

    <p>
      {% blocktrans trimmed %}
        For any questions about our Gold membership program,
        please <a href="mailto:rev@readthedocs.org?subject=Gold%20membership%20questions">email us</a>.
      {% endblocktrans %}
    </p>

    {% if golduser %}
    <h3>
        {% blocktrans trimmed %}
        Your gold membership
        {% endblocktrans %}
    </h3>

    <p>
        {% blocktrans trimmed %}
        Thanks for supporting Read the Docs! It really means a lot to us.
        {% endblocktrans %}
    </p>

    <p class="subscription-detail subscription-detail-level">
        <label>{% trans "Level" %}:</label>
        <span>{{ golduser.get_level_display }}</span>
    </p>

    <form action="{% url "gold_subscription_portal" %}" method="post" class="payment">
        {% csrf_token %}
        <input type="submit" value="{% trans "Manage subscription" %}" />
    </form>

    <h3>{% trans "Gold projects" %}</h3>
    <p class="subscription-projects">{% trans 'Choose projects you would like to make ad-free.' %}</p>

    <form method="get" action="{% url "gold_projects" %}" class="subscription-projects">
        <input type="submit" value="{% trans "Select Projects" %}" />
    </form>
    {% else %}
    <h3>
        {% blocktrans trimmed %}
        Become a Gold member
        {% endblocktrans %}
    </h3>

    <form action="" method="post" id="gold-register" class="payment">
        {% csrf_token %}
        {{ form }}
        <input id="submit" type="submit" value="{% trans "Sign Up" %}" />
    </form>
    {% endif %}
  </div>
{% endblock %}
